import React, { Profiler, useState, useRef } from "react";
import { useEffect } from "react";
import create from "zustand";
import product from "immer";

const useCountStore = create((set, get) => ({
  count: 1,
  add: () => set((store) => ({ count: store.count + 1 })),
}));

const unsub = useCountStore.subscribe((store) => {
  console.log("store", store);
});
const timer = setInterval(() => {
  useCountStore.setState((store) => ({
    count: store.count + 1,
  }));
  useCountStore.getState().add();

  if (useCountStore.getState().count >= 10) {
    unsub();
    clearInterval(timer);
  }
}, 1000);

function App() {
  const onRender = (...props) => {
    console.log("onRender", props);
  };
  return (
    <Profiler id="App" onRender={onRender}>
      <div></div>
    </Profiler>
  );
}

export default App;
